<extend name="Base:base" />
<block name="main-content">
<link href="__PUBLIC__/css/store-index.css" rel="stylesheet">
<div id="ListBox" class="box1200">
	<div class="path15">
		<a href="__APP__/Home/Food">首页</a>&nbsp;&nbsp;&nbsp;>&nbsp;&nbsp;&nbsp;
	</div>

	<div class="search row">
		<form action="__APP__/Home/Food/search" method="get">
			<div class="col-xs-2" style="float: right;">
				<div class="input-group">
					<input type="text" name="search" class="form-control"
						placeholder="搜索"> <span class="input-group-btn">
						<button class="btn btn-default" type="submit">
							<span class="glyphicon glyphicon-search"></span>
						</button>
					</span>
				</div>
				<!-- /input-group -->
			</div>
		</form>
	</div>
	<div class="ListBox" style="height: auto; background-color: #fbfbfb;">
		<div class="ListBox-left">
			<div class="user-Box">
				<div class="user-img">
					<div class="por">
						<a href="__APP__/Home/User/index"><img width="88" height="88"
							src="{$Think.session.store.image}"></a>
					</div>
				</div>
				<div class="user-info">
					<div class="user-name">{$Think.session.store.name}</div>
					<div class="user-dname">店铺名称：{$Think.session.store.account}</div>
					<div class="user-sh">审核状态：已通过审核</div>
				</div>
				<div class="clear"></div>
				<div class="user-an"></div>
			</div>
			<div class="clear"></div>

			<div id="menu-nav">
				<foreach name="tags" item="tag" key="tag_k">
				<div class="dv_r_5">
					<a class="bt1">{$tag_k}</a>
				</div>
				<div class="dw_navlist" style="display: none;">
					<ul>
						<foreach name="tag" item="tag_item">
						<li><a href="__CONTROLLER__/getFoodByTag/tag/{$tag_item.id}">{$tag_item.tag}</a></li>
						</foreach>
					</ul>
				</div>
				</foreach>
			</div>
		</div>
		<div class="ListBox-right">
			<div class="neilist-cp-box">
				<?php $i =0;?>
				<foreach name="list" item="food">
				<div class="neilist-pictu" id="food_{$food.id}">
					<ul>
						<li class="cplist-p01"><a target="_blank"
							href="javascript:addCart({$i});"> <img src="{$food.food_image}"></a></li>
						<li class="cplist-p02"><a target="_blank" href="#">{$food.food_name}
						</a></li>
						<li class="cplist-p02"><span class="cplist-p02-r">￥{$food.price}元 /{$food.unit}</span></li>
						<li class="cplist-p02"><a href="javascript:addCart({$i});"><img
								src="__PUBLIC__/img/dg01.png"></a></li>
					</ul>
				</div>
				<?php $i++;?>
				</foreach>
			</div>
			<div class="clear"></div>
			<div class="neilist_bottom_right">
				<if condition="$totalPages gt 1 ">
				<ul>{$page}
				</ul>
				<form action="__SELF__" method="get">
					<input type="hidden" name="search" value="{$Think.get.search}"/>
					<div class="input-group col-xs-2">
						<input type="number" class="form-control input" placeholder="跳转到"
							name="p" min="1"> <span class="input-group-btn">
							<button class="btn btn-default"
								style="background: #efefef none repeat scroll 0 0;"
								type="submit">Go!</button>
						</span>
					</div>
				</form>
				</if>
			</div>
		</div>
	</div>
</div>
<!-- 添加菜单弹出框 -->
<div class="modal fade" id="myAddModal" tabindex="-1" role="dialog"
	aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog" style="width: 530px;">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"
					aria-hidden="true">&times;</button>
				<h4 class="modal-title" id="myModalLabel">添加</h4>
			</div>
			<div class="modal-body">
				<form class="form-horizontal style-form" id="form_add"
					action="__APP__/Home/User/addAdr" method="post"
					enctype="multipart/form-data">
					<div class="form-group" align="center">
						<div class="col-xs-8 col-xs-offset-2 ">
							<img src="" style="width: 221px; height: 164px;" id="add_image">
						</div>
					</div>
					<div class="form-group" align="center">
						<label id="add_name"></label>
					</div>
					<div class="form-group" align="center">
						<label id="add_price" style="color: red;"></label>
					</div>
					<div class="form-group" align="center">
						<label id="add_introduce"></label>
					</div>
					<div class="form-group" align="center" id="category-content">
						<label class="col-xs-offset-2 col-xs-2">规格:</label>
						<div class="btn-group col-xs-8" data-toggle="buttons" id="add_category">
										
						</div>
					</div>
					<div class="form-group" align="center">
					<label class="col-xs-offset-2 col-xs-2">数量:</label>
							<div class="col-xs-4">
								<div class="input-group">
									<span class="input-group-btn">
										<button class="btn btn-default" type="button" id="btn_decrease">&nbsp;-&nbsp;</button>
									</span> <input type="number" id="add_number"
										class="form-control" value="1"
										style="text-align: center;" min="1" max="999" disabled/>
									<span class="input-group-btn">
										<button class="btn btn-default" type="button" id="btn_add">&nbsp;+&nbsp;</button>
									</span>
								</div>
							</div>
					</div>
				</form>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
				<button type="button" class="btn btn-danger">确定</button>
			</div>
		</div>
	</div>
</div>
</block>
<block name="js-content"> <script type="text/javascript">
var list = <?php echo json_encode($list); ?>;
var addCartUrl = "__APP__/Home/Cart/add";
var categoryUrl = "__APP__/Home/Food/category";
var fid;
var food_category;
var food;
var cid;
$("#add_category").on('change', function () {
	var val = $('#add_category input:radio:checked').val();
	var category = food_category[val];
	cid = category['id'];
	$("#add_price").html(category['price']+"元/"+category['unit']);
});
function addCart(id){
	food = list[id];
// 	console.log(food);
	fid = food['id'];
	$("#add_image").attr("src",food['food_image']);
	$("#add_name").html(food['food_name']);
	$("#add_price").html(food['price']+"元/"+food['unit']);
	$('#add_introduce').html(food['introduce']);
	$('#add_number').val(1);
	$('#add_category').html("");
	$.post(categoryUrl,{fid:fid},function(data){
		console.log(data);
			if(data['result']){
				$("#category-content").show();
				$("#add_price").html(food['price']+"元/"+food['unit']);
				var list = data['list'];
				food_category = list;
				var count = list.length;
				cid = list[0]['id'];
				if(count == 1){
					$("#category-content").hide();
				}else{
					for(var i=0;i < count;i++){
						var item = list[i];
						if(i==0){
							$('#add_category').append('<label class="btn btn-default active"><input type="radio" class="category" name="category" id="category'+i+'" value="'+i+'" autocomplete="off" checked>'+item['title']+'</label>');
						}else{
							$('#add_category').append('<label class="btn btn-default"><input type="radio" class="category" name="category" id="category'+i+'" value="'+i+'" autocomplete="off">'+item['title']+'</label>');
						}
					}
				}
			}else{
				$("#category-content").hide();
			}
	});
	$("#myAddModal").modal('show');
}
$('#myAddModal').on('click','button.btn-danger',function (event){
	var num = $('#add_number').val();
	if(!$("#category-content").is(":hidden")){
		var val = $('#add_category input:radio:checked').val();
		if(typeof(val) == "undefined"){
			alert('请先选择个规格');
		}else{
			cid = food_category[val]['id'];
		}
	}
	$.post(addCartUrl,{cid:cid,num:num},function(data){
		var imgae = $("#add_image").attr("src");
		var start = $('#food_'+fid).offset();
		var offset = $('#btn_cart').offset();
		var stop = $(document).scrollTop();
		var flyer = $('<img class="u-flyer" src="'+imgae+'" style="z-index: 9999;width:220px;height:164px;"/>');
		flyer.fly({
		    start: {
		        left: start.left,
		        top: (start.top-stop)
		    },
		    end: {
		        left: offset.left,
		        top: (offset.top-stop),
		        width: 20,
		        height: 20
		    },
		    onEnd:function(){
			    console.log("end");
		    	flyer.remove();
			}
		});
		if(data['result']){
			$("#cart_num").html(data['cartnum']);
		}
		$("#myAddModal").modal('hide');
	}); 
});
$("#btn_decrease").click(function(e){
	var num = $('#add_number').val();
	if(num > 1){
		num--;
	}
	$('#add_number').val(num);
});
$("#btn_add").click(function(e){
	var num = $('#add_number').val();
	if(num < 999){
		num++;
	}
	$('#add_number').val(num);
});
</script> </block>